<template>
  <div>
    <Content style="width:90%">
      <Form :label-width="140">
        <FormItem label="选择省份" required>
          <Select placeholder="请选择省份" v-model="dataForm.provinceCode">
            <Option v-for="item in seletions" :key="item.id" :value="item.code">{{item.name}}</Option>
          </Select>
        </FormItem>
        <FormItem label="选择商品分类">
          <Cascader placeholder="请选择分类" :data="category" :render-format="selectFormat" :load-data="loadData"></Cascader>
        </FormItem>
        <FormItem label="基础费用(元)" required>
          <InputNumber :min="0" v-model="dataForm.baseFees" placeholder="请输入基础费用"></InputNumber>
        </FormItem>
        <FormItem label="是否默认费用">
          <RadioGroup v-model.number="dataForm.defaultStatus">
            <Radio :label="1">
              <span>是</span>
            </Radio>
            <Radio :label="0">
              <span>否</span>
            </Radio>
          </RadioGroup>
        </FormItem>
        <FormItem label="是否包邮">
          <RadioGroup v-model.number="dataForm.postalStatus">
            <Radio :label="1">
              <span>是</span>
            </Radio>
            <Radio :label="0">
              <span>否</span>
            </Radio>
          </RadioGroup>
        </FormItem>
        <FormItem>
          <Button type="primary" @click="Submit">提交</Button>
        </FormItem>
      </Form>
    </Content>
  </div>
</template>
<script>
export default {
  name: "Update",
  props: {
    callbank: Function
  },
  data() {
    return {
      category: [],
      categoryArray: [],
      seletions: this.$dict.provinceSet.data,
      dataForm: {
        shopId: this.$store.getShop('shopId'),
        orgId: this.$store.getOrg('orgId'),
        provinceCode: null,
        provinceName: null,
        categoryId: null,
        categoryPath: null,
        categoryName: null,
        baseFees: 0,
        defaultStatus: 0,
        postalStatus: 0
      }
    }
  },
  watch: {
    categoryArray(val) {
      console.log(val)
			this.dataForm.categoryId = val[val.length - 1]
		}
  },
  methods: {
    Submit() {
      if(!this.dataForm.provinceCode) {
        this.$Message.error({
          content: '省份不能为空'
        })
        return
      }
      this.dataForm.provinceName = this.$dict.provinceSet.name(this.dataForm.provinceCode)
      new this.$rest({
        gateway: 'agroerp',
        service: "agroerp-tms",
        url: "/v1.0/logistics/costs/config",
        data: {
          pojo: this.dataForm
        },
        action: (res) => {
          if (res.data.code === 20000) {
            this.$Message.success({
              content: '添加成功',
            })
            this.callbank()
          } else {
            this.$Message.error({
              content: res.data.msg
            })
          }
        },
      }).post()
    },
    init(){
			new this.$rest({
				service: 'agroerp-shop',
				gateway: 'agroerp',
				url: '/v1.0/plus/category/lazy',
				query: {
					equal:{
            categoryType: 0
          }  
				},
				action: (res)=>{
					if(res.data.code === 20000){
						const data = res.data.data
						this.category = data
					} else {
						this.$Notice.warning({
							title: '商品分类获取失败',
							desc: `失败原因：${res.data.msg}`
						})
					}
				}
			}).get()
		},
    loadData(item, callback) {
      item.loading = true;
      new this.$rest({
				service: 'agroerp-shop',
				 gateway: 'agroerp',
				url: '/v1.0/plus/category/lazy',
				query: {
					equal: {
            categoryPid: item.value,
            categoryType: 0
          },
				},
				action: (res)=>{
					if(res.data.code === 20000){
						const data = res.data.data
						item.children = data
						item.loading = false;
            callback();
					} else {
						this.$Message.error(res.data.msg)
					}
				}
			}).get()
    },
    selectFormat(labels,selected) {
      const index = labels.length - 1
      const data = selected[index] || false
      this.dataForm.categoryPath = data.__value
      this.dataForm.categoryId = data.value
      this.dataForm.categoryName = data.label
      return data.__label
    }
  },
  created() {
    this.init()
  }
}
</script>
<style scoped>
</style>